import React, { Component } from "react";
import { View, Text, Image, StyleSheet, ScrollView, TextInput } from "react-native";
import CustomerHeader from "../../widget/customerHeader";
import  LinearGradient from 'react-native-linear-gradient';

const Cell=({title})=>{
  return (
    <View style={styles.cell}>
      <Text style={{color:'#222222',fontSize:14}}>{title}</Text>
      <Image style={{width:6,height:12}} source={require('../../img/arrow_right_icon.png')}></Image>
      <View style={styles.bottomLine}></View>
    </View>
  )
}

export default class HelpAndFeedBack extends Component{
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <View style={{flex:1,backgroundColor:'#fff'}}>
        <CustomerHeader title={'帮助反馈'} leftOnPress={()=>{this.props.navigation.pop()}}></CustomerHeader>
        <ScrollView style={{flex:1,backgroundColor:'#F6F6F6',paddingHorizontal:12}}>
          <Text style={styles.sectionTitle}>常见问题</Text>
          <View style={{borderRadius:8,overflow:"hidden"}}>
            <Cell title={'1、如何投稿问题广场？'}></Cell>
            <Cell title={'1、如何投稿问题广场？'}></Cell>
            <Cell title={'1、如何投稿问题广场？'}></Cell>
            <Cell title={'1、如何投稿问题广场？'}></Cell>
            <Cell title={'1、如何投稿问题广场？'}></Cell>
          </View>
          <Text style={styles.sectionTitle}>意见反馈</Text>
          <View style={styles.inputBox}>
            <TextInput style={{flex:1}} multiline={true}
                       textAlignVertical="top" placeholder={'请写下您的建议'}></TextInput>
          </View>
          <LinearGradient style={styles.submitBox} colors={['#e79c58','#f8da85']} start={{x:0,y:1}}>
            <Text style={styles.submitTitle}>提交</Text>
          </LinearGradient>
        </ScrollView>
      </View>
    )
  }
}

const styles=StyleSheet.create({
  sectionTitle:{
    color:'#999999',
    fontSize:13,
    height: 42,
    lineHeight:42
  },
  cell:{
    height:50,
    flexDirection:'row',
    justifyContent:'space-between',
    alignItems:'center',
    backgroundColor:'#fff',
    paddingHorizontal:15
  },
  bottomLine:{
    position:'absolute',
    left:15,
    right:15,
    bottom:0,
    height:1,
    backgroundColor: '#F6F6F6'
  },
  inputBox:{
    backgroundColor:'#fff',
    borderRadius:8,
    overflow:'hidden',
    height:160,
    paddingHorizontal:15,
    paddingVertical:15
  },
  submitBox:{
    height:44,
    borderRadius:22,
    marginHorizontal:24,
    marginTop:49
  },
  submitTitle:{
    color:'#fff',
    fontWeight:'500',
    fontSize: 15,
    flex:1,
    lineHeight: 44,
    textAlign:'center'
  }
})
